<template>
  <view class="container">
    <view class="usermessage">
      <view class="item">
        <view>开户行</view>
        <input class="message" type="text" placeholder="请输入开户行">
      </view>
      <view class="item">
        <view>姓名</view>
        <input class="message" type="text" placeholder="请输入姓名">
      </view>
      <view class="item">
        <view>卡号</view>
        <input class="message" type="text" placeholder="请输入卡号">
      </view>
      <view class="item">
        <view>手机号</view>
        <input class="message" type="text" placeholder="请输入手机号">
      </view>
      <view class="item">
        <view>验证码</view>
        <input class="message" type="text" placeholder="请输入验证码">
        <view class="getma">获取验证码</view>
      </view>
    </view>
    <view class="submit">提交绑定</view>
  </view>
</template>

<script setup>

</script>

<style lang="scss" scoped>
.container {
  min-height: 100vh;
	background: $body-bc;
	color: $content-color;
  .usermessage {
    padding: 28rpx;
    .item {
      display: flex;
      align-items: center;
      justify-content: space-between;
      background: #112959;
      box-shadow: 0rpx 10rpx 17rpx 1rpx rgba(0,14,41,0.3);
      border-radius: 15rpx;
      padding: 37rpx 32rpx;
      margin-bottom: 22rpx;
      .message {
        text-align: end;
        font-family: Source Han Sans CN;
        font-weight: 400;
        font-size: 28rpx;
        color: #00C1FF;
      }
      .getma {
        background: #00C1FF;
        border-radius: 23rpx;
        font-family: Source Han Sans CN;
        font-weight: 400;
        font-size: 24rpx;
        color: #112959;
        padding: 11rpx 21rpx;
      }
    }
  }
  .submit {
    margin: 100rpx 94rpx 110rpx;
    background: url('/static/business/order.png') center center no-repeat;
    background-size: 100%;
    display: flex;
    justify-content: center;
    padding: 25rpx 0;
    font-family: FZLanTingHeiS-R-GB;
    font-weight: 400;
    font-size: 30rpx;
    color: #00C1FF;
  }
}
</style>
